<template>
  <div id="app">
    <header class="head">
        <div class="head-content clearfix">
          <div class="head_left fl">
            <div class="img_wrap ">
              <img src="./common/imgs/logo.png" class="Img_logo">
            </div>
            <p class="title">FAQ Center</p>        
          </div>        
          <div class="head_right fr">
            <span class="icon_left">
              <img src="./common/imgs/left.svg" alt="">
            </span>
            <span class="text">返回crm库</span>
          </div>   
        </div>           
    </header> 
    <div class="main-content">        
      <router-view/>
    </div>
  </div>
</template>

<script>
export default {
  name: 'App'
}
</script>

<style lang='scss'>
#app {
  background-color: #f3f3f3;
  height: 100%;
  .head{
    width: 100%;
    height: 100px;
    background-color: #fff;   
    border-bottom: 2px solid #b5b5b5;
    box-shadow:0px 1px 6px #b5b5b5;  
    margin-bottom: 2px;  
    .head-content{
      width: 1200px;
      margin:0 auto;
      box-sizing: border-box;
      .head_left{
        font-size: 0;
        .img_wrap{
          display: inline-block;
          vertical-align: top;
          padding: 3px 30px 0 30px;
          // padding-top: 3px;         
        }
        .title{
          display: inline-block;
          padding-top: 48px;
          font-size: 24px;
          color: #6f6f6f;
        }
      }
      .head_right{
        cursor: pointer;
        padding-top: 54px;
        font-size: 16px;
        color: #6f6f6f;
      }            
    }
  }  
  .main-content{
    background-color: #f3f3f3;
    // height: ;
  }
  .Img_logo{
    width:140px;
  }
}

/* //清除默认样式 */
body,ul,ol,p,h1,h2,h3,h4,h5,h6,dl,dd,input,textarea,select,figure{
  // -webkit-font-smoothing: antialiased;
  // -moz-osx-font-smoothing: grayscale;
  margin: 0;
  padding: 0;
  }
body{font-size:14px;font-family: Arial, 'Microsoft YaHei';;line-height: 1 !important;}
img{vertical-align: top;border: none;}
a{text-decoration: none;}
textarea{resize: none;}
ul{list-style: none;}

input,select,textarea{border: none;outline: none;}
address,em, i {
    font-style: normal;
}
strong,b{
    font-weight: normal;
}
h1,h2,h3,h4,h5,h6 {  
    line-height: 1; 
    font-size:100%;   
    font-weight:bold;   
} 
table{   
    border-collapse:collapse;   
    border-spacing:0;   
} 
button{
    outline: none;
    border:none;
    padding: 0;
}

/**清浮动**/
.clearfix:after{content: "";display: block;clear: both;}
.clearfix{zoom:1;}
 
.fl{
    float: left;
}
.fr{
    float: right;
}
.show{
    display: block;
}
.hide{
    display: none;
}
/* //扩展点击区域 */
.extend { position: relative;} 
.extend::before { 
    content: ''; 
    position: absolute; 
    top: -10px;
    right: -10px; 
    bottom: -10px;
    left: -10px; 
}
</style>
